<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style>

    form#payment {
    background: #9cbc2c;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    padding: 20px;
    width: 400px;
    }

   form#payment fieldset {
    border: none;
    margin-bottom: 10px;
    }
    form#payment fieldset:last-of-type {
    margin-bottom: 0;
    }

   form#payment legend {
    color: #384313;
    font-size: 16px;
    font-weight: bold;
    padding-bottom: 10px;
    text-shadow: 0 1px 1px #c0d576;
    }

   form#payment fieldset fieldset legend {
    color: #111111;
    font-size: 13px;
    font-weight: normal;
    padding-bottom: 0;
    }

    form#payment ol li {
    background: #b9cf6a;
    background: rgba(255,255,255,.3);
    border-color: #e3ebc3;
    border-color: rgba(255,255,255,.6);
    border-style: solid;
    border-width: 2px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
   border-radius: 5px;
   line-height: 30px;
   list-style: none;
   padding: 5px 10px;
   margin-bottom: 2px;
   }
   form#payment ol ol li {
   background: none;
   border: none;
   float: left;
   }

    form#payment label {
   float: left;
   font-size: 13px;
    width: 110px;
    }
    form#payment fieldset fieldset label {
    background:none no-repeat left 50%;
    line-height: 20px;
    padding: 0 0 0 30px;
   width: auto;
   }
   form#payment label[for=visa] {
   background-image: url(visa.gif);
   }
   form#payment label[for=amex] {
   background-image: url(amex.gif);
   }
   form#payment label[for=mastercard] {
   background-image: url(mastercard.gif);
   }
   form#payment fieldset fieldset label:hover {
   cursor: pointer;
   }










</style>




</head>
<body>


<form id=payment>
<fieldset>
<legend>Contact Bugsby</legend>
<ol>
<li>
<label for=name>Name</label>
<input id=name name=name type=text placeholder="First and last name" required autofocus>
</li>
<li>
<label for=email>Email</label>
<input id=email name=email type=email placeholder="example@domain.com" required>
</li>
<li>
<label for=phone>Phone</label>
<input id=phone name=phone type=tel placeholder="Eg. +447500000000" required>
</li>
<li>
<label for=address>Comments:</label>
<textarea id=address name=address rows=5 required></textarea>
</li>
</ol>
</fieldset>
</form>

</body>
</html>
